<extend name="Common:base" />
<block name="head">
  <style>
    .el-table__body tr.current-row>td{
      background: rgba(157, 195, 232, 0.7);
    }
		#edit .el-dialog__body {
		    padding: 20px 20px;
		    color: #475669;
		    font-size: 14px;
		}
		#edit .el-dialog__footer {
		    padding: 0px 20px 15px;
		    margin-bottom:30px;
		    text-align: right;
		    box-sizing: border-box;
		}
    .container > .wrapp > .el-row {
      margin-bottom: 6px;
    }
  </style>
</block>
<block name="body">
	<div id="app" class="container">
		<div class="wrapp" v-show="show" style="display: none">
			<!-- seach form -->
			<el-row style="margin-bottom:20px;">
				<el-col :span="24">
					<el-form :inline="true"  ref="searchForm" :model="searchForm" :rules="searchRules" >
					  <el-form-item prop="project" style="width: 200px;" v-if="user_role_id == 18" ><!-- style="width: 200px;display:none;" -->
					  	<el-select size="small" v-model="searchForm.project"  placeholder="请选择绩效考核方案(必选)" >
					  		<el-option value="1" label="方案一(人资中心)"></el-option>
					  		<el-option value="2" label="方案二(非人资中心)"></el-option>
					  	</el-select>
					  </el-form-item>
					<el-form-item prop="start">
		                <el-date-picker size="small" v-model="searchForm.start" type="month" 
		                  placeholder="请选择绩效月份" 
		                  @change="startDateChange"
		                  >
		                </el-date-picker>
		            </el-form-item>
           <!--  <el-form-item prop="end">
               <el-date-picker 
                 v-model="searchForm.end" 
                 placeholder="请选择止日期" 
                 @change="endDateChange"
                 size="small"
                 >
               </el-date-picker>
           </el-form-item> -->
                  
					<el-form-item  prop="money">
					   <el-input v-model="searchForm.money"  placeholder="请输入项目总金额" >
					   </el-input>
					</el-form-item>
					<el-form-item prop="plan_num" style="width: 220px;"  v-if="user_department_id == 22" >
					   <el-input v-model="searchForm.plan_num"  placeholder="请输入计划招聘人数(人资中心)"  >
					   </el-input>
					</el-form-item>
					<el-form-item  prop="department_id"  v-if="user_role_id == 18" >
			          <el-select v-model="searchForm.department_id" size="small" placeholder="请选择人事所在部门" >
			            <el-option v-for="department in allDepartments" :label="department.name" :value="department.id"></el-option>
			          </el-select>
			        </el-form-item>
					  <el-form-item> 
					    <el-button type="primary" size="small" icon="search" @click="loadDatalist">查询</el-button>
					    <el-button @click="searchReset" size="small" style="margin-left:10px;">重置</el-button>
					  </el-form-item>
            <el-form-item>
              <el-tooltip content="点击刷新当前页面" placement="right">
                <el-button @click="refresh" size="small" type="danger">刷新</el-button>
              </el-tooltip>
            </el-form-item>
					</el-form>
				</el-col>
			</el-row>
			<!-- / search form -->

			<!-- datatables  -->
			<el-row>
				<el-col :span="24">
					<el-table 
					  :data="dataList" 
				      v-loading="dataLoad" 
				      element-loading-text="{:L('DATA_LOGIN')}"
				      highlight-current-row
				      @selection-change="handleSelectionChange"
					 @row-click="showDetail"
					 border>
					    <!-- <el-table-column type="selection"  width="50" >
					    </el-table-column> -->
					    <el-table-column  label="序号"  width="70" :formatter="handleIndex" >
					    </el-table-column>
 					    <el-table-column prop="user_id"  label="人事的姓名" width="150" align="center">
					         <template scope="scope">
					          {{ getType(scope.row.user_id, 'userNames') }}
					        </template>
					    </el-table-column>
					    <el-table-column prop="department_id"  label="人事所在部门" width="150" align="center">
					         <template scope="scope">
					          {{ getType(scope.row.department_id, 'departmentNames') }}
					        </template>
					    </el-table-column>
					     <el-table-column prop="entry_num" label="入职人数(人资中心/非人资中心)" width="192">
					   </el-table-column>
					    <el-table-column prop="retention_num" label="留用人数(人资中心/非人资中心)" width="192">
					   </el-table-column>
					     <el-table-column prop="interviewer_num" label="面试人数(非人资中心)" width="192">
					   </el-table-column>
					    <el-table-column prop="recommend_num" label="内部推荐并入职人数(非人资中心)" width="192">
					   </el-table-column>
					   <el-table-column prop="achievement_ratio" label="招聘达成率完成比例(人资中心)" width="192">
					   </el-table-column>
					    <el-table-column prop="achievement_proportion" label="招聘达成率占比(人资中心)" width="140" align="center">
					    </el-table-column>
					     <el-table-column prop="success_ratio" label="招聘成功率比例(非人资中心)" width="192">
					   </el-table-column>
					    <el-table-column prop="success_proportion" label="招聘成功率占比(非人资中心)" width="140" align="center">
					    </el-table-column>
					    <el-table-column prop="retention_ratio" label="新员工留用率完成比例(人资中心/非人资中心)" width="192">
					   </el-table-column>
					     <el-table-column prop="retention_proportion" label="新员工留用率占比(人资中心/非人资中心)" width="192" align="center">
					    </el-table-column>
					    <el-table-column prop="recommend_proportion" label="推荐人数占比(非人资中心)" width="140" align="center">
					    </el-table-column>
					   <el-table-column prop="achievement_bonus" label="绩效奖金" width="140" align="center">
					  </el-table-column>
					   <!--  {$viewDecorator['oprate']} -->

				    </el-table>
				</el-col>
			</el-row>
			<!-- / datatables  -->
			
			<!-- toolbar -->
				<el-row type="type"  justify="space-between" align="middle"  class="row-bg">
				  <el-col :span="12">
				  <div class="grid-content bg-purple">
				  	<el-button-group>
				  		<!-- {$viewDecorator['button']} -->


				    </el-button-group>
				    
				  </div>
				  </el-col>
				  <el-col :span="12">
				  <div class="grid-content bg-purple-light pull-right">
				    <!-- page -->
				    <include file="Common:_pagination" />
				    <!-- / page -->
				    
				  </div></el-col>
				</el-row>
			<!-- / toolbar -->
		</div>
		
		<div class="dialogWrapper" v-show="show" style="display: none">
			<!-- 高级查询 -->
			<!--<include file="_searchx" />-->
			<!-- / 高级查询 -->

			<!-- 添加 -->
			<include file="_add" />
			<!-- / 添加 -->

			<!-- 编辑 -->
			<include file="_edit" />
			<!-- / 编辑 -->

			<!-- 角色 -->
			<include file="_role" />
			<!-- / 角色 -->

			<!-- 修改身份信息 -->
			<include file="_editIDx" />
			<!-- / 修改身份信息 -->

			<!-- 确认身份 -->
			<include file="_editConfirmx" />
			<!-- / 确认身份 -->

			<!-- 编辑 密码-->
			<include file="_editPassword" />
			<!-- / 编辑 -->
		</div>

	</div>
</block>
<block name="scripts">
	<script>
		var validatePass2 = function(rule, value, callback)  {

	        if (window.defaultVm.editPasswordForm.checkPass === '') {
	          callback(new Error('请再次输入密码'));
	        } else if (window.defaultVm.editPasswordForm.checkPass !== window.defaultVm.$data.editPasswordForm.password) {
	          callback(new Error('两次输入密码不一致!'));
	        } else {
	          callback();
	        }
	    }
        //手机号码
		  var checkPhone=function(rule,value,callback){
		     var phoneReg = /^1[34578]\d{9}$/;
		     if(value==='' || value===null){
		       callback();
		     }else if(!phoneReg.test(value)){
		       callback('手机号格式错误');
		     }else{
		       callback();
		     }
		  }
		 //qq号码
		  var checkQQ=function(rule,value,callback){
		    var number=/^\d+$/;
		    if(value==='' || value===null){
		      callback();
		    }else if(!number.test(value)){
		      callback('QQ号格式错误');
		    }else{
		      callback();
		    }
		  }
	</script>
	<script>
	Vue.filter('handleAddress',function(v){
		if (v!=null && v.length > 10) {
			var length = (arguments[1] || 10);
			return v.substring(0,length)+'......';  
		} else {
			return v;
		}
	})
	</script>
	<script>
		page.getUserRolesUrl="{:U('getUserRoles')}";
		page.setUserRolesUrl="{:U('setUserRoles')}";
		page.changePasswordUrl="{:U(changePassword)}";
		window.defaultOption.setDatas({
			//projectshow:session('account')['userInfo']['role_id'],
			user_role_id:{$user_role_id},
			user_department_id:{$user_department_id},
			roleList:{:json_encode($roleList)},
			allRoles:{:json_encode($allRoles)},
			allDepartmentsList:{:json_encode($allDepartmentsList)},
			allDepartments:{:json_encode($allDepartments)},
			pathInfo:{folder:'users'},

			addUpload:"",
			addUploadImg:false,

			editUpload:"",
			editUploadImg:false,

			xuploadheader:{"X-Requested-With":"XMLHttpRequest"},
			groupList:{:json_encode($groupList)},
			provinces:[],
			cities:[],
			districts:[],
			sexType:{:json_encode($sexType)},
			multipleSelection:[],

			searchRules:{
				money:[
					{pattern:/^([1-9]{1,4}\d{0,5}$)|(^0$)/,message:'项目总金额只能是非零正整数！',trigger:'blur'}
				],
				plan_num:[
					{pattern:/^([1-9]{1,4}\d{0,5}$)|(^0$)/,message:'计划招聘人数只能是非零正整数！',trigger:'blur'}
				]


			},
			addRules:{
				account:[
					{ required: true, message: '请输入账号', trigger: 'blur' }
				],
				realname:[
          {required: true, message: '请输入员工姓名', trigger: 'blur'},
				],
				mphone:[
          {validator: checkPhone, trigger: 'blur'},
				],
				phone:[
        	{pattern:/^(0\d{2,3}-)\d{7,8}(-(\u8f6c)?\d{1,5})?$/,message: '座机号格式错误',trigger: 'blur'}
				],
				qq:[
          {validator: checkQQ, trigger:'blur'},
				],
				weixin:[
          {pattern:/^[a-zA-Z]([a-zA-Z\d_-]){5,19}$/,message: '微信号格式错误',trigger: 'blur'}
				],
				id_card:[
        	{pattern:/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,message:'身份证号格式错误',trigger:'blur'}
 				]

			},
			editRules:{
				account:[
					{ required: true, message: '请输入账号', trigger: 'blur' }
				],
				realname:[
					{required: true, message: '请输入员工姓名', trigger: 'blur'},
				],
				mphone:[
					{validator: checkPhone, trigger: 'blur'},
				],
				qq:[
					{validator: checkQQ, trigger:'blur'},
				],

			},
			card_img:"",
			card_front:"",
			card_back:"",
			departmentItem:{$departmentItem},

			/*departments:{:json_encode($departments['list'])},*/
		groups:{:json_encode($departments['group'])},
		/*我加的 开始*/
		userNames:{:json_encode($userNames)},
		departmentNames:{:json_encode($departmentNames)},
		sexType:{:json_encode($sexType)},
		sourcesType:{:json_encode($sourcesType)},
		departments:{:json_encode($departments)},
		sourcesList:{:json_encode($sourcesList)},
		typeList:{:json_encode($typeList)},
		allTypes:{:json_encode($allTypes)},
		/*我加的 结束*/
			types:[
			    {name:"员工账号",value:'account'},
			{name:"员工姓名",value:'realname'},
			{name:"手机号",value:'mphone'},
            {name:"QQ号",value:'qq'},
            {name:"微信号",value:'weixin'}
			    ]
		}).setForm('add',{
			name:"",
			role_id:"",
			department_id:"",
			id:"",
			sex:0,
			id_card:"",
			mphone:"",
			qq:"",
			weixin:"",
			graduation_date:"",
			university:"",
			major:"",
			position:"",
			info_sources:"",
			resume_enterprise_name:"",
			resume_entry_date:"",
			resume_position:"",
			resume_leader:"",
			resume_leader_phone:"",
			resume_leaving_reasons:"",
			interviewer_date:"",
			interviewer_name:"",
			interviewer_department:"",
			interviewer_mphone:"",
			interviewer_qq:"",
			interviewer_opinion:"",
			type:""
		}).setForm('edit',{
			name:"",
			role_id:"",
			department_id:"",
			id:"",
			sex:0,
			id_card:"",
			mphone:"",
			qq:"",
			weixin:"",
			graduation_date:"",
			university:"",
			major:"",
			position:"",
			info_sources:"",
			resume_enterprise_name:"",
			resume_entry_date:"",
			resume_position:"",
			resume_leader:"",
			resume_leader_phone:"",
			resume_leaving_reasons:"",
			interviewer_date:"",
			interviewer_name:"",
			interviewer_department:"",
			interviewer_mphone:"",
			interviewer_qq:"",
			interviewer_opinion:"",
			type:""
		}).setForm('setRoles',{
			user_id:0,
			role_ids:0
		},true).setForm('search',{
			project:"",
			department_id:{:json_encode($departments['account'][0]['id'])},
			money:"",
			start:'{$start}',
            end:'{$end}',
            plan_num:"",
			type:""
		}).setForm('editPassword',{
			id:"",
			account:"",
			password:"",
			checkPass:""
		}, true).setMethod('getType', function(type, field){
			return this[field][type];
		}).setMethod('startDateChange', function(v){
      this.searchForm.start = v;
    }).setMethod('endDateChange', function(v){
      this.searchForm.end = v;
    }).setMethod('departmentChange',function () {
			var vmThis=this
			vmThis.$http.get('{:U("getAllGroups")}',{params:{department_id:vmThis.searchForm.department_id}}).then(function (response) {
				vmThis.groups=response.body
				vmThis.searchForm.group_id=''
            })
        }).setMethod('getTime',function(v){
			if(v==null || v==""){
				return v;
			}else{
		      var date = new Date(v*1000);
			  var year = date.getFullYear();
			  var month = date.getMonth()+1;
			  var day = date.getDate();
			  var hour = date.getHours();
			  var minute = date.getMinutes();
			  var second = date.getSeconds();
			  month=month<10?'0'+month:month;
			  day=day<10?'0'+day:day;
			  hour=hour<10?'0'+hour:hour;
			  minute=minute<10?'0'+minute:minute;
			  second=second<10?'0'+second:second;
			  return year+'-'+month+'-'+day+' '+hour+':'+minute+':'+second;
			}
	
		}).setMethod('handleSetRoles', function(index, row){
			// var vmThis = this;
			var f = FormName.getForm('setRoles');
			this[f].user_id = row.id;
			this[f].role_ids = row.role_id;
			
			this.openDialog('setRoles');
			
		}).setMethod('addFormUploadSuccess', function(response, file, fileList){
			this.addUpload = '__ROOT__'+ response.path;
			this.addUploadImg = true;
			this.addForm.head = response.path
		}).setMethod('addFormUploadError', function(err, response, file){
			this.$message.error('上传出错：' + response.info);
		}).setMethod('editFormUploadSuccess', function(response, file, fileList){
			this.editUpload = '__ROOT__'+ response.path;
			this.editUploadImg = true;
			this.editForm.head = response.path
		}).setVueHook('mounted', function(){
	    var vmThis = this;
	    this.$http.get('{:U("Area/getAreasByPid")}', {params:{pid:1} }).then(function(response){
	      var provinces = [];
	      response.body.forEach(function(currentValue,index){
	        provinces.push({id: currentValue.id, name: currentValue.name});
	      })
	      vmThis.$set(vmThis, 'provinces', provinces);
	    });
	  }).setMethod('provinceChange', function(v){
	    var vmThis = this;
	    this.$http.get('{:U("Area/getAreasByPid")}', {params:{pid:v} }).then(function(response){
	      var cities = [];
	       response.body.forEach(function(currentValue,index){
	        cities.push({id: currentValue.id, name: currentValue.name});
	       })
	       vmThis.$set(vmThis, 'cities', cities);
	       vmThis.$set(vmThis['addForm'], 'area_city', "");
	    })
	  }).setMethod('cityChange', function(v){
	    var vmThis = this;
	    this.$http.get('{:U("Area/getAreasByPid")}', {params:{pid:v} }).then(function(response){
	      var cities = [];
	       response.body.forEach(function(currentValue,index){
	        cities.push({id: currentValue.id, name: currentValue.name});
	       })
	       vmThis.$set(vmThis, 'districts', cities);
	    })
	  }).setMethod('handleEdit', function(index, row){
	  		var type ='edit';
	  		var tar = {};
	  		Oassign(tar, row);
	  		Oassign(tar, row.userInfo);
	  		delete tar.userInfo;
		  	this.initObject( this[FormName.getFormName(type)], tar );
			this.editIndex = index;
			this.editUpload = '__ROOT__'+ tar.head;
			this.editUploadImg = true;
			this.openDialog(type);
	  }).setMethod('beforeEdit',function(){
	    if (!this.$refs['editselect']) {
	      this.provinceChange(this.editForm.area_province);
	      this.cityChange(this.editForm.area_city);
	    }
	  }).setMethod('beforeChangePassowrd', function(){
	    var form = 'editPassword';
	    var vmThis = this;
	    if (this.multipleSelection.length ==0 ) {
	      this.closeDialog(form);
	      this.$message.error('请先选择一个员工');
	    } else if(this.multipleSelection.length > 1){
	    	this.closeDialog(form);
	        this.$message.error('只能选择一个员工');
	    } else {
	       var row = this.multipleSelection[0];
	       this.editPasswordForm.id = row.id;
	       this.editPasswordForm.account = row.account;
	    }
	  }).setMethod('afterChangePassowrd',function(){
	  	   this.editPasswordForm.id = "";
	       this.editPasswordForm.account = "";
	       this.editPasswordForm.password = "";
	       this.editPasswordForm.checkPass = "";
	  }).setMethod('handleSelectionChange', function(val){
	    this.multipleSelection = val;
	  }).setMethod('setImgUrl', function(url){
	  	return '__ROOT__' + url;
	  }).setMethod('closeSetRole', function(){
	  	 // this.dataReload();
	  }).setMethod('cardImg', function(response, file, fileList){
			// this.card_img = '__ROOT__'+ response.path;
			this.addForm.card_img = response.path
	  }).setMethod('cardFront', function(response, file, fileList){
			// this.card_front = '__ROOT__'+ response.path;
			this.addForm.card_front = response.path
	  }).setMethod('cardBack', function(response, file, fileList){
			// this.card_back = '__ROOT__'+ response.path;
			this.addForm.card_back = response.path
	  }).setMethod('editCardImg', function(response, file, fileList){
			// this.card_img = '__ROOT__'+ response.path;
			this.editForm.card_img = response.path
	  }).setMethod('editCardFront', function(response, file, fileList){
			// this.card_front = '__ROOT__'+ response.path;
			this.editForm.card_front = response.path
	  }).setMethod('editCardBack', function(response, file, fileList){
			// this.card_back = '__ROOT__'+ response.path;
			this.editForm.card_back = response.path
	  }).setMethod('beforeAvatarUpload', function(file){
	  	var  isLt8M = file.size / 1024 / 1024 < 8;

	  	if (!isLt8M) {
          this.$message.error('上传头像图片大小不能超过 8MB!');
        }

        return isLt8M;
	  }).setMethod('showDetail', function(row){
    this.name = row.name;
    this.openDialog('detail');
  }).setMethod("handleQuit", function(index, row, url){
			if (!arguments[2]) {
				url= this.page.deleteUrl;
			}
			var vmThis = this;
			this.$confirm('确定离职?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
	    }).then(function(){
      	vmThis.$http.post(url, {ids:[row.id]}).then(function(response){
      		var message = '离职成功!';
      		if (response.body.info) {
      			message = response.body.info;
      		}
      		vmThis.$message({
	            type: 'success',
	            message: message
	          });

      		// vmThis.dataList.splice(index, 1);

      		vmThis.loadDatalist();
      		//this.dataLoad = true;
	       // this.loadDatalist();

	      	}, function(response){
	      		var message = '离职失败';
	      		if (response.body.info) {
	      			message = response.body.info;
	      		}
	      		vmThis.$message({
		            type: 'error',
		            message: '离职失败'
		          });
	      })
	    }).catch(function() {
        vmThis.$message({
          type: 'info',
          message: '已取消离职'
        });          
	    });
	  });
	</script>
</block>
